// 页面加载完成后的初始化
document.addEventListener('DOMContentLoaded', function() {
    // 添加页面加载动画
    const content = document.querySelector('.welcome-content');
    content.style.opacity = '0';
    content.style.transform = 'translateY(30px)';
    
    setTimeout(() => {
        content.style.transition = 'all 1s ease-in';
        content.style.opacity = '1';
        content.style.transform = 'translateY(0)';
    }, 100);
});

// 开始学习按钮点击事件
function startLearning() {
    // 添加按钮点击动画
    const button = document.querySelector('.start-button');
    button.style.transform = 'scale(0.95)';
    
    setTimeout(() => {
        button.style.transform = 'scale(1)';
        
        // 这里可以跳转到课程主页面
        // 暂时跳转到课程介绍页面
        window.location.href = '#course-intro';
        
        // 实际使用时，可以替换为真实的课程页面URL
        // window.location.href = '/course/index.html';
    }, 150);
}

// 添加键盘支持
document.addEventListener('keydown', function(e) {
    if (e.key === 'Enter' || e.key === ' ') {
        startLearning();
    }
});

// 添加触摸支持（移动设备）
let touchStartY = 0;
let touchEndY = 0;

document.addEventListener('touchstart', function(e) {
    touchStartY = e.changedTouches[0].screenY;
});

document.addEventListener('touchend', function(e) {
    touchEndY = e.changedTouches[0].screenY;
    handleSwipe();
});

function handleSwipe() {
    if (touchEndY < touchStartY - 50) {
        // 向上滑动，开始学习
        startLearning();
    }
}

// 添加视差滚动效果
window.addEventListener('scroll', function() {
    const scrolled = window.pageYOffset;
    const shapes = document.querySelectorAll('.floating-shape');
    
    shapes.forEach((shape, index) => {
        const speed = 0.5 + (index * 0.2);
        shape.style.transform = `translateY(${scrolled * speed}px)`;
    });
});

// 添加鼠标移动视差效果
document.addEventListener('mousemove', function(e) {
    const mouseX = e.clientX / window.innerWidth;
    const mouseY = e.clientY / window.innerHeight;
    
    const shapes = document.querySelectorAll('.floating-shape');
    shapes.forEach((shape, index) => {
        const speed = (index + 1) * 10;
        const x = (mouseX - 0.5) * speed;
        const y = (mouseY - 0.5) * speed;
        shape.style.transform += ` translate(${x}px, ${y}px)`;
    });
});
